<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">

		window.onload = function  () {

			text1 = document.getElementById('text1');
			text2 = document.getElementById('text2');
			
			window.onkeydown = function  (en) {
				data = en.key;

				text = text1.innerText;

				if(data==text[0].toLowerCase()){
					
					text = text.slice(1,text.length);
					text1.innerText = text;

					textdata = text2.innerText;

					textdata +=data;

					text2.innerText =textdata;
				}
			}
		}

	</script>
</head>
<body>
	<span style="color:red" id="text2"></span><span id="text1">At two o'clock in the morning during the month of August sounds of music could be heard proceeding from a brilliantly lighted house in Park Lane</span>
</body>
</html>